import { System, Menu,MenuItem } from "../global.slint";
import { ListView, VerticalBox } from "std-widgets.slint";



export component MenuPage inherits Rectangle{
    width: System.screen_width;
    height: System.screen_height;
    background: black;


    list:= VerticalLayout {
        y: Menu.list_pos_y;
        for item in Menu.menu_item:Rectangle{
            height: Menu.item_height;
            background: yellow;
            HorizontalLayout {
                alignment: start;
                spacing: 2px;
                Rectangle {
                    width: 10px;
                }
                Image {
                    source: item.icon;
                }
                Rectangle {
                    text:=Text {
                        font-size: 20px;
                        color: black;
                        text: @tr("{}",item.name);
                    }
                }

            }
        }

        animate y {
             duration: 100ms;
             easing: ease-in-out;
        }
    }


    Rectangle {
        y: Menu.border_y;
        height: Menu.item_height;
        border-width: 4px;
        border-color: blue;
        animate y {
             easing: ease-in-out;
             duration: 100ms;
        }
    }

    //当前选择的item index
    Text {
        visible: false;
        x:0px;
        color: black;
        text: Menu.current_index;
    }

    Rectangle {
        VerticalLayout {
            Rectangle {
                vertical-stretch: 1;
//                background: blue;
                TouchArea {
                    height: parent.height;
                    width: parent.width;
                    clicked => {
                        Menu.last()
                    }
                }
            }
            Rectangle {
                vertical-stretch: 1;
//                background: yellow;
                TouchArea {
                    height: parent.height;
                    width: parent.width;
                    clicked => {
                        Menu.next()
                    }
                }
            }
        }
    }


}